<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <title>虚拟券奖品</title>
    <link rel="stylesheet" type="text/css" href="css/reset.min.css">
    <link rel="stylesheet" type="text/css" href="css/main.min.css">
    <link rel="stylesheet" type="text/css" href="css/get_coupon.min.css">
    <script type="text/javascript">
    function get_hfs() {
        document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';
    }
    get_hfs();

    function throttle(method, context) {
        clearTimeout(method.timer);
        method.timer = setTimeout(function() {
            method.call(context);
        }, 100);
    }
    window.onresize = function() {
        throttle(get_hfs);
    }
    </script>
</head>

<body>
    <div class="container">
        <div class="get-coupon">
            <h3 class="coupon-title">请点击自选领取</h3>
            <p class="coupon-p">1.优惠礼券包含视频、出行、流量等多种卡券，请自选其一。
                <br>2.部分卡券活动期间每用户仅限领取一次，数量有限，领完即止。</p>
        </div>
        <ul class="get-img-list">
            <li class="get-img-item">
                <a href="##"><img src="img/get_img1.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img2.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img3.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img1.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img2.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img3.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img1.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img2.png" class="get-img"></a>
            </li>
            <li class="get-img-item">
                <a href="##"><img src="img/get_img3.png" class="get-img"></a>
            </li>
        </ul>
        <div class="pop-bg invisible">
            <div class="close-pop">
                <a href="javascript:void(0)" class="coupon-pop-close"></a>
            </div>
            <div class="coupon-pop">
                <h3 class="pop-title">平安100万交通出行险</h3>
                <img src="img/get_img2.png" class="pop-img">
                <div class="coupon-info">
                    <h4 class="coupon-title">话费使用说明</h4>
                    <p class="coupon-p">1、Q币将充值到您填写的QQ号中。可通过腾讯充值中心查询到账情况:http://pay.qq.com/。
                        <br> 2、腾讯Q币用于兑换腾讯公司直接运营的产品和服务，可购买腾讯所有包月服务、游戏道具及点券等。
                        <br> 3、腾讯Q币用于兑换腾讯公司直接运营的产品和服务，可购买腾讯所有包月服务、游戏道具及点券等。
                    </p>
                </div>
            </div>
            <div class="btn-pop">
                <div class="btn-content">
                    <a href="javascript:void(0)" class="get-coupon-btn">确认礼品信息并领取</a>
                </div>
            </div>
        </div>
    </div>
    <script src='js/jquery.min.js'></script>
    <script src="js/main.min.js"></script>
</body>

</html>
